Error Boundaries React
デフォルト
すべての子をレンダリングするだけで、実際には何もしない普通のラッパー
もしそこにエラーがあった場合
reactは最も近いError Boundariesか、スタティックメソッドを実装している最も近いコンポーネントを探して、Error エラーを渡す code:error-boundary.js
//エラーがスローされたらキャッチする?
static getDerivedStateFromError(error) {
// Update state so the next render will show the fallback UI.
return { hasError: true };
}
keyとstate reset
どういう時に使う？
どこに配置するかが大事
振り返る
お決まりのgetDerivedStateFromErrorで受け取って、FallbackComponentにerrorを渡す処理ラップして提供してくれる
? これ使うのが定番っぽい？
onReset が便利みたい
keyしていによるerror state resetよりも、余計な再レンダリングを防げる
再マウントが防げる？
ResetKeysというpropで変更されると、ErrorBoundary自身をリセット